<template>
	<view class="bg-white">
		<!-- 姓名 -->
		<view class="mlr-36 u-m-t-30">
			<view class="flex">
				<view class="ml-30 size-36">车主姓名</view>
				<view class="ml-10 mr-100"><input v-model="car_name" maxlength="8" type="text" placeholder="请输入车主姓名" />
				</view>
			</view>
			<view class="mt-20" style="border-top: solid 0.5px #eeeeee;"></view>
		</view>
		<!-- 电话 -->
		<view class="mt-20">
			<view class="mlr-36">
				<view class="flex">
					<view class="ml-30 size-36">手机号</view>
					<view class="ml-10 mr-100 "><input v-model="car_phone" maxlength="11" type="number"
							placeholder="请输入手机号" /></view>
				</view>
			</view>
			<view class="mt-20" style="border-top: solid 5px #eeeeee;"></view>
		</view>

		<!-- 车牌号 -->
		<view class="mlr-36 mt-20">
			<view class="flex">
				<view class="ml-30 size-36 ">车牌号</view>
				<view class="ml-10 mr-100 "><input v-model="car_card" type="text" placeholder="请输入车牌号" /></view>
			</view>
			<view class="mt-20" style="border-top: solid 0.5px #eeeeee;"></view>
		</view>

		<!-- 车辆品牌 -->
		<view class="mt-20">
			<view class="mlr-36">
				<view class="flex">
					<view class="ml-30 size-36 ">车辆品牌</view>
					<view class="ml-10 mr-100 "><input v-model="car_type" type="text" placeholder="请输入车辆品牌" /></view>
				</view>
			</view>
			<view class="mt-20 mlr-36" style="border-top: solid 0.5px #eeeeee;"></view>
		</view>

		<!-- 挡位 -->
		<!-- 	<view class="mlr-36 mt-20">
			<view class="flex" style=" width: 100%; ">
				<view class="ml-30 size-36 w100">挡位类型</view>
				<view class="w100" style=" margin-left: -140px;">
					<u-radio-group v-model="car_dw>0?car_dw:value" iconPlacement="right">
						<u-radio v-for="(item,index) in items" @change="radioChange" :name="item.name"
							activeColor="#3CBCA3">{{item.name}}</u-radio>
					</u-radio-group>
				</view>
			</view>
			<view class="mt-20" style="border-top: solid 0.5px #eeeeee;"></view>
		</view> -->

		<!-- 车辆型号 -->
		<view class="mt-20">
			<view class="mlr-36">
				<view class="flex">
					<view class="ml-30 size-36 ">车辆类型</view>
					<view class="ml-10 mr-100 "><input v-model="car_result" type="text" placeholder="请输入车辆型号" />
					</view>
				</view>
			</view>
			<view class="mt-20" style="border-top: solid 5px #eeeeee;"></view>
		</view>

		<!-- 接车地点 -->
		<view class="mlr-36 mt-20">
			<view class="flex">
				<view class="ml-30 size-36">接车点</view>
				<view class="gray-1" style="margin-right: 150rpx;">

					<input style="width: 145%;" placeholder-style="margin-left:50rpx;" type="text" placeholder="请输入接车地点"
						v-model="address" />
				</view>
			</view>
			<view class=" mt-20" style="border-top: solid 0.5px #eeeeee;"></view>
		</view>
		<view class="mlr-36 mt-20" v-show="address1">
			<view class="flex">
				<view class="ml-30 size-36 ">目的地</view>
				<view class=" gray-1" style="margin-right: 150rpx;">
					<input style="width: 145%;" placeholder-style="margin-left:50rpx;" type="text" placeholder="请输入目的地点"
						v-model="address1" />
				</view>
			</view>
			<view class=" mt-20" style="border-top: solid 0.5px #eeeeee;"></view>
		</view>
		<view class="mlr-36 mt-20" v-show="this.time.length">
			<view class="flex">
				<view class="ml-30 size-36 ">预约时间</view>
				<view class="ml-10 mr-100 "><input type="text" placeholder="请输入预约时间" v-model="this.time" /></view>
			</view>
			<view class=" mt-20" style="border-top: solid 0.5px #eeeeee;"></view>
		</view>
		<view class="mlr-36 mt-100 ">
			<u-button shape="circle" :custom-style="customStyle">
				<text v-if="ids3==0" class="size-35" @click="hujiao('泊车订单')">确认呼叫泊车</text>
				<text v-else-if="ids3==1" @click="hujiao('代驾订单')" class="size-35">确认呼叫代驾</text>
				<text v-else @click="hujiao('取车订单')" class="size-35">确认呼叫取车</text>
				<!-- '代驾订单','取车订单','泊车订单' -->
				<!-- <text class="size-35">确认呼叫取车员</text> -->
				<!-- <text v-if="this.time" class="size-35">预约泊车员</text> -->
			</u-button>
			<!-- -公共组件- {{ids3}} -->
		</view>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex'
	export default {
		props: ["ids2"],
		data() {
			return {
				input1: '',
				list: [],
				ids3: '', //接收到的当前标题栏值
				query: {},
				time: '',
				other: {},
				address: '',
				address1: ' ',
				//呼叫代驾 create
				car_name: '', //车主姓名
				car_phone: '', //车主手机号
				car_card: '', //车牌
				car_type: '', //车辆品牌
				car_dw: '手动挡', //自动 手动
				car_result: '', //车辆型号
				latitude: '',
				longitude: '',
				polyline: [],
				customStyle: {
					background: '#3CBCA3 !important',
					color: '#fff !important',
					border: 'none !important'
				},
				// 基本案列数据
				items: [{
						name: '手动档',
						label: "那看来"
						// disabled: false
					},
					{
						name: '自动挡',
						label: "那看来你"
						// disabled: false
					},
				],
				// u-radio-group的v-model绑定的值如果设置为某个radio的name，就会被默认选中
				value: '手动档',
			}
		},
		computed: {
			//tabList 
			...mapState(["start", "end", "tabList"]),
			covers() {
				return [{
					id: 1,
					latitude: this.latitude,
					longitude: this.longitude,
					iconPath: '../../static/now.png',
					title: '当前位置',
					width: 25,
					height: 25
				}, {
					id: 2,
					latitude: this.start.latitude,
					longitude: this.start.longitude,
					iconPath: '../../static/start.png',
					title: '起点位置',
					width: 40,
					height: 40
				}, {
					id: 3,
					latitude: this.end.latitude,
					longitude: this.end.longitude,
					iconPath: '../../static/end.png',
					title: '终点位置',
					width: 40,
					height: 40
				}]
			}
		},
		onLoad(option) {
			this.query = JSON.parse(decodeURIComponent(option.query))
			//console.log(888888, this.query);

			// 	"time": "2020-12-15 00:00",

			// 	"other": {
			// 		"tel": "16638143447",
			// 		"name": "小曲"
			// 	}
			// }
			if (this.query.time == '预约时间') {
				this.time = ''
			} else {
				// this.time = changeTime(this.query.time)
				this.time = this.query.time
			}
			this.other = this.query.other
			this.address = this.query.address
			this.address1 = this.query.address1
			this.ids3 = this.query.ids2
			console.log("tab", this.query.ids2);

			// let _this = this 获取当前位置
			// uni.getLocation({
			// 	type: 'gcj02',
			// 	success: function(res) {
			// 		_this.longitude = res.longitude
			// 		_this.latitude = res.latitude
			// 		_this.polyline = []
			// 		_this.getLine()
			// 	}
			// });
			this.getCar();
		},
		watch: {
			start(news, olds) {
				console.log(news);
			}
		},
		onShow() {},
		methods: {
			radioChange(e) {
				this.car_dw = e;
				console.log(this.car_dw);
			},
			getCar() {
				this.$http('/index.php/api/index/carindex', {
					user_id: '282',
				}, "POST").then((data) => {
					this.list = data;
					this.car_name = data[0].car_username, //车主姓名
						this.car_phone = data[0].car_userphone, //车主手机号
						this.car_card = data[0].car_pai, //车牌
						this.car_type = data[0].car_name, //车辆品牌
						this.car_result = data[0].car_type, //车辆型号
						// console.log("车辆信息查询成功");
						uni.showToast({
							icon: 'none',
							title: "车辆信息_ok",
							duration: 500
						})
				})
			},
			//呼叫代驾
			hujiao(text) {
				if (!this.car_name) {

					uni.showToast({
						title: '请输入正确姓名',
						icon: 'none'
					})
				} else if (!this.$u.test.mobile(this.car_phone)) {
					uni.showToast({
						title: '请输入正确手机号',
						icon: 'none'
					})
				} else if (this.$u.test.isEmpty(this.car_card)) {
					uni.showToast({
						title: '请输入车牌号',
						icon: 'none'
					})
				} else if (this.car_type == '') {
					uni.showToast({
						title: '请输入车辆品牌',
						icon: 'none'
					})
				} else if (this.car_result == '') {
					uni.showToast({
						title: '请输入车辆型号',
						icon: 'none'
					})
				} else if (this.address == '') {
					this.address = {},
						uni.showToast({
							title: '请输入接车地点',
							icon: 'none'
						})
				} else {
					console.log("开始请求creat");
					this.$http('/addons/ddrive/order/create', {
						start: this.start.name,
						start_city: this.start.city,
						start_address: this.address,
						start_latitude: this.start.latitude,
						start_longitude: this.start.longitude,
						end: this.end.name,
						end_city: this.end.city,
						end_address: this.address,
						end_latitude: this.end.latitude,
						end_longitude: this.end.longitude,
						distance: 0, //this.distance
						duration: 0,
						mobile: this.car_phone,
						car_name: this.car_name, //车主姓名
						car_phone: this.car_phone, //车主手机号
						car_card: this.car_card, //车牌
						car_type: this.car_type, //车辆品牌
						// car_dw: this.car_dw, //自动 手动
						car_result: this.car_result, //车辆型号
						appointment_time: this.time,
						drive_type: text //'代驾订单','取车订单','泊车订单'
					}, "POST").then((data) => {
						uni.showToast({
							title: "呼叫成功"
						})
						setTimeout(() => {
							uni.redirectTo({
								url: '/pages/home/bc-call/Agree?id=' + data.order_id
							})
							// uni.redirectTo({
							// 	url: '/pages/home/detail?id=' + data.order_id
							// })
						}, 100)
					})
				}


			}
		}
	}
</script>

<style lang="scss" scoped>
	page {
		// background-color: #F1EFEF;
		width: 100%;
		height: 100%;
	}
</style>
